<template>
  <div>
    <el-dialog title="工作事件" :visible.sync="dialogShow" :fullscreen="true" :close-on-click-modal="false">
      <event-item class="margin-bottom-20 border-line" ref="eventItem" :model="model"></event-item>
      <comment ref="comment" class="comment-box" :model="model" :is-leader="isLeader"></comment>
      <div class="bottom-box">
        <!-- <el-pagination :background="false" class="t-center margin-top-10" layout="prev, pager, next" :total="50"> </el-pagination> -->
        <div class="border-line padding-top-15"></div>
        <div class="flex justify-end padding-top-bottom-20 padding-right-40">
          <el-button v-if="isLeader" type="primary" size="mini" @click="turnWork">转为工作追踪</el-button>
          <el-button v-if="isLeader" type="primary" size="mini" @click="commentFn('levaeMsh')">留言</el-button>
          <!-- <el-button v-if="!isLeader && model.status == 2" type="primary" size="mini" @click="updateWork">修改事件</el-button> -->
          <el-button v-if="!isLeader && model.status == 1 && model.workStatus != 3" type="primary" size="mini" @click="overWork">结束事件</el-button>
          <el-button v-if="!isLeader" type="primary" size="mini" @click="commentFn('report')">汇报</el-button>
        </div>
      </div>
    </el-dialog>
    <leave-reply-message :model="model" ref="message" :is-leader="isLeader" :funcType="funcType" @refresh="getCommentList"></leave-reply-message>
    <add-work ref="work" :isLeader="isLeader"></add-work>
  </div>
</template>
<script>
  import formCommon from '@g/components/form/formCommon.vue';
  import { workInfoFiledList } from './form';
  import { apiWorkInfo, apiOrgList, apiManagerList, apiUpdateEvolve, apiComment, apiCommentReply, apiOverWork } from '../../api/workTrace';
  import { apiConstant } from '../../api/common';
  import { requestTips, askDialog } from '../../assets/util';
  import Comment from './components/comment';
  import eventItem from './components/eventItem.vue';
  import leaveReplyMessage from './components/leaveReplyMessage.vue';
  import addWork from './components/addWork.vue';

  export default {
    props: {
      isLeader: {
        type: Boolean,
        default: false,
      },
    },

    data() {
      return {
        dialogShow: false,
        model: {},
        funcType: '',
      };
    },

    methods: {
      //工作事件详情
      async getDataSource(key) {
        let res = await apiWorkInfo(key);
        let imgList = []
        res.imageAttachmentList && res.imageAttachmentList.forEach(item => {
          imgList.push(item.fileUrl)
        })
        res.imgList = imgList
        this.model = res;
        await this.$nextTick()
        this.getCommentList();
      },

      //更新
      updateWork() {
        this.$emit('updateWork', this.model);
      },

      getCommentList() {
        this.$refs.comment.getCommentList();
      },

      //留言
      commentFn(type) {
        this.funcType = type;
        this.$refs.message.init();
      },

      //结束事件
      async overWork() {
        askDialog('确认结束？', async () => {
          let res = await apiOverWork({ primaryKey: this.model.primaryKey });
          requestTips(res, () => {
            if (res.success) {
              this.getDataSource(this.model.primaryKey)
            } else {
              this.$message.error(res.message)
            }
          });
        });
      },

      //转为工作事件
      turnWork () {
        let model = this.model
        model.primaryKey = ""
        model.workType = ""
        this.$refs.work.callBackFn(model);
      }
    },

    components: { formCommon, eventItem, Comment, leaveReplyMessage, addWork },
  };
</script>
<style lang="scss" scoped>
  ::v-deep .el-dialog__header {
    background: #fff;
    .el-dialog__title,
    .el-dialog__close {
      color: #333;
    }
  }
  .comment-box {
    padding-bottom: 100px;
  }
  .bottom-box {
    background: #fff;
    z-index: 999;
    overflow: hidden;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
  }
</style>
